<?php
echo $this->headScript()->
        appendFile($this->baseUrl() . "/js/jquery-1.7.1.js")->
        appendFile($this->baseUrl() . "/js/bootstrap/bootstrap.js")->
        appendFile($this->baseUrl() . "/js/jquery.validate.js");

echo $this->headLink()
        ->setIndent('  ')
        ->prependStylesheet($this->baseUrl() . "/css/bootstrap/bootstrap.css")
        ->prependStylesheet($this->baseUrl() . "/css/bootstrap/bootstrap-responsive.css");
?>
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" >
    <title>Laboratorios Virtuales</title>    
     
    <style type="text/css">
      /* Override some defaults */
      html, body {        background-color: #eee;
      }
      body {
        padding-top: 40px; 
      }
      .container {
        width: 400px;
      }

      /* The white background content wrapper */
      .container > .content {
        background-color: #fff;
        padding: 20px;
        margin: 0 -20px; 
        -webkit-border-radius: 10px 10px 10px 10px;
           -moz-border-radius: 10px 10px 10px 10px;
                border-radius: 10px 10px 10px 10px;
        -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);
           -moz-box-shadow: 0 1px 2px rgba(0,0,0,.15);
                box-shadow: 0 1px 2px rgba(0,0,0,.15);
      }

	  .login-form {
		margin-left: 65px;
	  }
	
	  legend {
		margin-right: -50px;
		font-weight: bold;
	  	color: #404040;
	  }

    </style>
     <script type="text/javascript">
        function hideAlert() {
            $("#value-alert").hide(1000);
        }
        $(document).ready(function() {
            setTimeout("hideAlert()", 7500);

            $("#login-form").validate({
                rules: {
                    username: {
                        required: true
                    },
                    password: {
                        required: true
                    }
                },
                messages: {
                    username: "Username requerido",
                    password: "Password requerido"
                }
            });
        });
    </script>
</head>
<body>
  <div class="container">
    <div class="content">
      <div class="row">
        <div class="login-form">
          <h2>Login</h2>
          <form id="login-form" action="<?php echo $this->url(array('module' => 'admin', 'controller' => 'login', 'action' => 'login')); ?>" method="post">            
              <div class="clearfix">
                  <input type="text" id="username" name="username">                
              </div>
              <div class="clearfix">
                  <input type="password" id="password" name="password">
              </div>              
              <button  class="btn btn-inverse" >Sign in</button>
              <a href="<?php echo $this->url(array('module' => 'admin', 'controller' => 'login', 'action' => 'passwordforgot')); ?>">Olvid&oacute; su password?</a>
              <?php echo $this->loginError; ?>
            </fieldset>
          </form>
        </div>
      </div>
    </div>
  </div> <!-- /container -->
</body>
</html>
